<template>
  <div>
    <!-- 面包屑导航 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/admin' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>交流帖子管理</el-breadcrumb-item>
    </el-breadcrumb>
    <!-- 搜索筛选 -->
    <el-form :inline="true" :model="formInline" class="user-search">
      <el-form-item label="搜索：">
        <el-input
          size="small"
          v-model="formInline.kw"
          placeholder="输入标题"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <el-button
          size="small"
          type="primary"
          icon="el-icon-search"
          @click="onSearch"
          >搜索</el-button
        >
      </el-form-item>
    </el-form>
    <!--列表 noticeId hotelName location floor price status-->
    <el-table size="small" :data="listData" highlight-current-row v-loading="loading" border element-loading-text="拼命加载中" style="width: 100%;">
      <el-table-column align="center" prop="createTime" label="发帖时间" width="220">
        <template slot-scope="scope">
          <div>{{scope.row.publishTime|timestampToDayHM}}</div>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="user.realName" label="发帖人">
        <template slot-scope="scope">
          <div v-if="scope.row.userId!=null">{{scope.row.user.nickName}}</div>
          <div v-if="scope.row.adminId">{{scope.row.admin.realName}}</div>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="title" label="标签" show-overflow-tooltip>
        <template slot-scope="scope">
          <span v-if="scope.row.tags!=null&&scope.row.tags!=''">
            <el-tag size="small" type="warning" v-for="(tag,id) in scope.row.tags.split(';')" :key="id">{{ tag }}</el-tag>
          </span>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="title" label="标题" show-overflow-tooltip>
      </el-table-column>
      <!-- <el-table-column align="center" prop="content" label="详情" show-overflow-tooltip>
      </el-table-column> -->
      <el-table-column align="center" label="操作" width="190">
        <template slot-scope="scope">
          <el-button size="mini" type="success" @click="toDetailPage(scope.row.froumId)">详情</el-button>
          <el-button size="mini" type="danger" @click="offShelf(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页组件 -->
    <Pagination v-bind:child-msg="pageparm" @callFather="callFather"></Pagination>
  </div>
</template>

<script>
import { AdminForumList,AdminDeleteForum } from '@/api/api.js'
import Pagination from '../../components/Pagination'

export default {
  data() {
    return {
      loading: false, //是显示加载
      editFormVisible: false, //控制编辑页面显示与隐藏
      query: {},
      scenicId: '',
      formInline: {
        page: 1,
        limit: 10,
        kw: '',
        token: localStorage.getItem('logintoken')
      },
      listData: [], //列表数据
      // 分页参数
      pageparm: {
        currentPage: 1,
        pageSize: 10,
        total: 10
      },
    }
  },
  // 注册组件
  components: {
    Pagination
  },
 
  created() {
    this.getdata(this.formInline)
  },

  /**
   * 里面的方法只有被调用才会执行
   */
  methods: {
     // 获取数据列表
     getdata(parameter) {
      console.log('开始获取列表！', parameter)
      this.loading = true
      AdminForumList(parameter)
        .then(res => {
          this.loading = false
          if (res.success) {
            this.listData = res.data.records
            this.pageparm.currentPage = res.data.currentPage
            this.pageparm.pageSize = res.data.pageSize
            this.pageparm.total = res.data.totalrecord;
          } else {
            this.$message({
              type: 'info',
              message: res.msg
            })
          }
        })
        .catch(err => {
          this.editFormVisible = false
          this.loading = false
          this.$message.error('系统繁忙，请稍后再试！')
        })
    },
    // 分页插件事件
    callFather(parm) {
      this.formInline.page = parm.currentPage
      this.formInline.limit = parm.pageSize
      this.getdata(this.formInline)
    },
    //详情
    toDetailPage(fid) {
      this.$router.push({ path: '/admin/forum/commentmgr?fid='+fid })
    },

    // 删除
    offShelf(row) {
      let msg = "确定要删除该帖子吗？"
      let req = {forumId: row.froumId}
      this.$confirm(msg, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        console.log('删除帖子', req)
        AdminDeleteForum(req)
          .then((res) => {
            if (res.success) {
              this.$message({
                type: "success",
                message: "操作成功!",
              });
              this.getdata(this.formInline);
            } else {
              this.$message({
                type: "info",
                message: res.msg,
              });
            }
          })
          .catch((err) => {
            this.loading = false;
            this.$message.error("操作失败，请稍后再试！");
          });
      })
    },

    onSearch(){
      this.getdata(this.formInline)
    },

  }
}
</script>

<style scoped>
.user-search {
  margin-top: 20px;
}
</style>

 
 